<template>
    <div class="input-item">
      <el-form :model="autoDeleteFrom" ref="autoDeleteFrom" :rules="rules" label-width="250px">
          <div class="parameType-wrap">
              <div class="parameType">
                <div class="button">
                    <span class="title2">自动删除相关参数</span>
                  <!-- <span>基本参数配置</span> -->
                  <el-button style="float: right; padding:4px 8px;" type="primary" @click="autoDeleteClick('autoDeleteFrom')">确定</el-button>
                </div>
                <el-col :xs="24" :sm="24" :lg="24">
                    <el-form-item label="执行日志自动删除时间点：">
                    <el-select v-model.number="autoDeleteFrom.AutoDelHours" class="input-style">
                        <el-option v-for="item in 24" :key="item" :label="item-1 + ':00'" :value="(item-1)"></el-option>
                    </el-select>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="24" :lg="24">
                    <el-form-item label="日志储存天数：" prop="LogSaveDays">
                        <el-input class="input-style" v-model.number="autoDeleteFrom.LogSaveDays"><span slot="append">天</span></el-input>
                        <span class="tips-style">（填0表示不执行日志自动删除）</span>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="24" :lg="24">
                  <el-form-item label="上次执行时间：">
                    <span style="color:#46a6ff">{{autoDeleteFrom.LastActTime}}</span>
                  </el-form-item>
                </el-col>
              </div>
          </div>    
      </el-form>
      <el-form :model="deviceform" ref="deviceform" :rules="rules2" label-width="250px">
          <div class="parameType-wrap">
                <div class="parameType">
                    <div class="button">
                        <span class="title2">装置维护相关参数</span>
                    <!-- <span>基本参数配置</span> -->
                        <el-button style="float: right; padding:4px 8px;" type="primary" @click="operationClick('deviceform')">确定</el-button>
                    </div>
                    <el-col :xs="24" :sm="24" :lg="24">
                        <el-form-item label="持续运行多长时间自动重启设备：" prop="reset_keep_run_seconds">
                            <el-input class="input-style" v-model="deviceform.reset_keep_run_seconds"><span slot="append">小时</span></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="24" :lg="24">
                        <el-form-item label="每天指定时间自动重启设备：">
                            <el-select v-model.number="deviceform.reset_on_hours" class="input-style">
                                <el-option v-for="item in 24" :key="item" :label="item-1 + ':00'" :value="(item-1)"></el-option>
                            </el-select>
                            <!-- <el-select class="input-style" v-model="deviceform.reset_on_hours">
                                <el-option v-for="item in 24" :key="item" :label="(item-1) + ':00'" :value="item-'1'"></el-option>
                            </el-select> -->
                        </el-form-item>
                    </el-col>
                </div>
          </div>    
      </el-form>
    </div>
</template>
  
<script>
import { connrequest } from '@/api/firstPage'
import { parseTime } from '@/utils/index.js'
import { validNum } from '@/utils/validate'
export default {
    data() {
        return {
            autoDeleteFrom:{
                AutoDelHours:0,
                LogSaveDays:0,
                LastActTime:''
            },
            deviceform:{
                reset_keep_run_seconds:'0',
                reset_on_hours:0
            },
            oldData:[],
            rules:{
                LogSaveDays:[{required:true,validator:validNum,trigger:'blur'}],
            },
            rules2:{
                reset_keep_run_seconds:[{required:true,validator:validNum,trigger:'blur'}],
            }
        }
    },
    created(){
    this.getData()
    // console.log();
    
    },
    methods:{
        async getData(){
            // const data = {}
            const res = await connrequest('GetParamLogCfg')
            const res1 = await connrequest('GetParamThreshhold')
            console.log(res.Data,res1.Data);
            this.autoDeleteFrom = res.Data
            this.autoDeleteFrom.LastActTime = parseTime(this.autoDeleteFrom.LastActTime);
            this.oldData = res1.Data;
            res1.Data = res1.Data.map(item => {
                for (const i in this.deviceform) {
                    if (item.Name === i) {
                        this.deviceform[i] = item.Value
                    }
                }
            })
            this.deviceform.reset_on_hours = Number(this.deviceform.reset_on_hours)
            this.deviceform.reset_keep_run_seconds = this.deviceform.reset_keep_run_seconds/60/60
        },
        async autoDeleteClick(formName){
            this.$refs[formName].validate(async(valid) => {
                if (valid) {
                    const data = {
                        Data: {
                            AutoDelHours:this.autoDeleteFrom.AutoDelHours,
                            LogSaveDays:this.autoDeleteFrom.LogSaveDays
                        }
                    }
                    const res = await connrequest('SetParamLogCfg',data);
                    this.$message.success('修改成功')
                    this.getData();
                }
            })    
            // let number = /^\d+$/
            // if (!number.test(this.autoDeleteFrom.LogSaveDays)) {
            //     this.$message.error("日志储存天数只能填数字");
            //     return false
            // }
            
        },
        async operationClick(formName){
          this.$refs[formName].validate(async(valid) => {
            if (valid) {
                this.deviceform.reset_keep_run_seconds = this.deviceform.reset_keep_run_seconds*60*60
                this.oldData = this.oldData.map(item => {
                for (const key in this.deviceform) {
                    if(item.Name === key){
                        if (typeof this.deviceform[key] != 'string') {
                            item.Value = JSON.stringify(this.deviceform[key])
                        }else{
                            item.Value = this.deviceform[key]
                        }
                    }
                    }
                    return item
                })
                const data = {
                    Data:this.oldData
                }
                const res = await connrequest('SetParamThreshhold',data)
                this.$message.success('修改成功')
                this.getData();
            }
          })
        }
    }
}
</script>

<style lang="scss" scoped>
/* @import url(); 引入css类 */
.parameType-wrap{
    display:flex;
    flex-wrap: wrap;
    margin-bottom: 20px;
}
::v-deep.input-item{
    // margin-top: 10px;
    .parameType{
    border: 1px solid #eceff5;
    border-radius: 3px;
    width: 800px;
    //   padding: 10px;
    margin: 0px;
    box-shadow: 0 0 10px #eceff5;
    .button{
        
        border-bottom: 1px solid #eceff5;
        padding-bottom : 10px;
    }
    }
    .el-form-item{
    margin-bottom: 18px;
    }
    .el-input-group__append, .el-input-group__prepend{
    width: 60px;
    padding: 0;
    text-align: center;
    }
}
.button{
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}
::v-deep.el-form-item{
    label{
    font-weight: 500;
    }
}
.input-style{
    width: 60% !important;
}
</style>